import { Role } from '@/utils/types.d';
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import { ProTable, ProColumns } from '@ant-design/pro-components';
import { useModel } from 'umi';
import { queryCompanies } from '../SystemUser/service';
import { queryParkinglotNames } from '../Parking/Spot/service';
import { AbnormalOrderStatus, AbnormalOrderTypeEnum } from './abnormal-order';
import { queryAbnormalOrderList } from './service';
import { Button } from 'antd';
import { useState } from 'react';
import moment from 'moment';

const AbnormalOrderList = () => {
  const { initialState } = useModel('@@initialState');
  const currUser = initialState?.currentUser;
  const isAdmin = currUser?.role === Role.ADMIN;

  // 记录此界面的查询选项，将查询条件传递给下一级界面
  const [searchCondition, setSearchCondition] = useState<{
    ownerId?: string;
    type?: AbnormalOrderType;
    status?: AbnormalOrderStatusType;
    parkingLotId?: string;
  }>({});
  const columns: ProColumns<AbnormalOrderTableItem>[] = [
    {
      title: '所属用户',
      dataIndex: 'ownerId',
      width: 80,
      align: 'center',
      hideInTable: !isAdmin,
      hideInSearch: !isAdmin,
      fieldProps: { showSearch: true },
      debounceTime: 300,
      request: (val) => queryCompanies(val.keyWords),
    },
    {
      title: '订单编号',
      dataIndex: 'orderNo',
      width: 140,
      align: 'center',
      hideInForm: true,
    },
    {
      title: '路段名称',
      dataIndex: 'parkingLotId',
      hideInForm: true,
      width: 120,
      align: 'center',
      render: (_, record) => record.parkingLotName,
      fieldProps: { showSearch: true },
      debounceTime: 300,
      request: (val) => queryParkinglotNames(val.keyWords),
    },
    {
      title: '泊位编号',
      dataIndex: 'spotId',
      hideInForm: true,
      width: 80,
      // hideInTable: true,
      align: 'center',
    },
    {
      title: '巡检车牌',
      dataIndex: 'plateNumber',
      align: 'center',
      width: 100,
      hideInForm: true,
    },
    {
      title: '泊位车牌',
      dataIndex: 'spotPlateNumber',
      align: 'center',
      width: 100,
      hideInSearch: true,
      hideInForm: true,
    },
    {
      title: '异常类型',
      dataIndex: 'type',
      width: 120,
      align: 'center',
      hideInForm: true,
      valueEnum: {
        [AbnormalOrderTypeEnum.SENSOR_OCCUPY_PATROL_FREE]: {
          text: '地磁有车，巡检无车',
          status: 'Error',
        },
        [AbnormalOrderTypeEnum.SENSOR_FREE_PATROL_OCCUPY]: {
          text: '地磁无车，巡检有车',
          status: 'Error',
        },
        [AbnormalOrderTypeEnum.LICENSE_CHANGED]: { text: '地磁未变，车牌变化', status: 'Error' },
        [AbnormalOrderTypeEnum.UNKNOWN_LICENSE]: { text: '未知车牌', status: 'Error' },

        [AbnormalOrderTypeEnum.LICENSE_CONFLICT]: { text: '车牌冲突', status: 'Error' },
        [AbnormalOrderTypeEnum.LICENSE_SIMILAR]: { text: '车牌变更异常', status: 'Error' },
      },
    },
    {
      title: '创建时间',
      width: 180,
      dataIndex: 'createTime',
      align: 'center',
      hideInForm: true,
      hideInSearch: true,
      valueType: 'dateTime',
    },
    {
      title: '处理状态',
      width: 80,
      dataIndex: 'status',
      align: 'center',
      hideInForm: true,
      valueEnum: {
        [AbnormalOrderStatus.WAITING]: { text: '待处理', status: 'Processing' },
        [AbnormalOrderStatus.HANDLED]: { text: '已处理', status: 'Success' },
        [AbnormalOrderStatus.CANCELED]: { text: '已作废', status: 'Default' },
      },
    },
    {
      title: '关联订单',
      dataIndex: 'relatedOrderNo',
      width: 120,
      hideInForm: true,
      hideInSearch: true,
      align: 'center',
    },
    {
      title: '开始时间',
      dataIndex: 'startTime',
      hideInForm: true,
      hideInTable: true,
      valueType: 'dateTime',
      initialValue: moment().startOf('day'),
    },
    {
      title: '结束时间',
      dataIndex: 'endTime',
      hideInForm: true,
      hideInTable: true,
      valueType: 'dateTime',
      initialValue: moment().endOf('day'),
    },
    {
      title: '操作',
      width: 80,
      fixed: 'right',
      align: 'center',
      valueType: 'option',
      render: (_, record) => [
        <Button
          key={`${record._id}_fixbtn`}
          type={record.status == AbnormalOrderStatus.WAITING ? 'primary' : 'default'}
          size="small"
          onClick={() => {
            const param = {
              search: searchCondition,
              currentData: record,
            };
            localStorage.setItem('abnormalParams', JSON.stringify(param));
            window.open('#/order/abnormal-audit');
          }}
        >
          {record.status == AbnormalOrderStatus.WAITING ? '审核' : '查看'}
        </Button>,
      ],
    },
  ];
  return (
    <PageHeaderWrapper
      header={{
        title: '',
        subTitle: '订单管理',
        breadcrumb: {
          routes: [
            {
              path: '/',
              breadcrumbName: '首页',
            },
            {
              path: '/order',
              breadcrumbName: '订单管理',
            },
            {
              path: '/order/abnormal-list',
              breadcrumbName: '异常订单',
            },
          ],
        },
      }}
    >
      <ProTable<AbnormalOrderTableItem>
        columns={columns}
        rowKey="_id"
        scroll={{ x: true }}
        style={{ whiteSpace: 'nowrap' }}
        search={{ labelWidth: 'auto' }}
        columnEmptyText="暂无数据"
        pagination={{
          showSizeChanger: true,
          showQuickJumper: true,
          defaultPageSize: 10,
          size: 'default',
        }}
        debounceTime={300}
        request={async (params, sort) => {
          setSearchCondition({
            type: params.type,
            ownerId: params.ownerId,
            parkingLotId: params.parkingLotId,
            status: params.status,
          });
          return await queryAbnormalOrderList(params, sort);
        }}
      />
    </PageHeaderWrapper>
  );
};

export default AbnormalOrderList;
